<template>
    <div class="test">
      <uap-button @click="loading" type="primary" size="large">loading</uap-button>
      <div class="main" v-loading.fullscreen="isShow" uap-loading-text="加载中...">
          <ul>
            <li>11111111</li>
            <li>11111111</li>
            <li>11111111</li>
            <li>11111111</li>
          </ul>
      </div>
      <uap-button @click="open" type="primary" size="large">v-loading</uap-button>
    </div>
</template>

<script>

export default {
    data() {
        return {
            isShow: false
        }
    },
    methods: {
        loading() {
            this.$loading.show();
            setTimeout(()=>{
                this.$loading.hide();
            }, 2000)
        },
        open() {
            this.isShow = !this.isShow;
        }
    },
}
</script>

<style lang="scss" scoped>
.main{
    display: flex;
    margin-top: 50px;
    width: 100%;
    height: 200px;
    border:1px solid red;
}
</style>
